<template>
    <view class="addressItem">
        <view class="topAddress" @tap="chooseAddress()">
            <view class="userBox">
                <view class="userName">{{item.name}}</view>
                <view class="userTel">{{item.phone}}</view>
            </view>
            <view class="addressName">{{item.address}}</view>
        </view>
        <u-divider lineColor="#99999933" />
        <view class="btnBox">
            <view class="defaultBox" @tap="changeDefault">
                <image class="checkIcon" :src="item.isDefault ? '/static/img/checked.png' : '/static/img/check.png'" mode="widthFix" />
                <text :class="['mr', item.isDefault && 'ismr']">默认</text>
            </view>
            <view class="editDelete">
                <view class="edit" @click="editAddress(index)">
                    <u-icon name="edit-pen" />
                    编辑
                </view>
                <view class="delete" @click="deleteAddress(index)">
                    <u-icon name="trash" />
                    删除
                </view>
            </view>
        </view>
    </view>
</template>

<script>
    export default {
        props: {
            item: Object
        },
        data() {
            return {

            }
        },
        methods: {
			// 点击地址
			chooseAddress() {
				const pages = getCurrentPages().reverse();
				console.log(pages)
				const chooseAddress = pages.find(i => i.route === 'pages/address/address').options.chooseAddress
				if (chooseAddress) { // 跳转到地址页面是选择地址的
					// 点击返回上一页并存储点击的地址
					uni.setStorage({
						key: 'chooseAddress',
						data: this.item,
						success: () => {
							uni.navigateBack()
						}
					})
				}
			},
			changeDefault() {
				if (!this.item.isDefault) {
					// 调设置默认地址接口
					this.$emit('changeDefault')
				}
			},
            editAddress() {
                uni.navigateTo({
                    url: '/pages/address/creatAddress?address=' + JSON.stringify(item)
                })
            },
            deleteAddress() {
                uni.showModal({
                	title: '提示',
                	content: '是否确认删除收货地址，删除后不可恢复！',
                	success: (res) => {
                        if (res.confirm) {
                            console.log('删除')
                        }
                	}
                })
            }
        }
    }
</script>

<style lang="scss" scoped>
    .addressItem {
        margin-bottom: 30rpx;
        background-color: $uni-bg-color;
        border-radius: $uni-border-radius-llg;
        font-family: OPPOSans, OPPOSans;
        .topAddress {
            padding: 40rpx 40rpx 10rpx;
            font-weight: 500;
            .userBox {
                display: flex;
                justify-content: space-between;
                align-items: center;
                .userName {
                    font-size: 36rpx;
                    color: $uni-text-color;
                }
                .userTel {
                    font-size: 30rpx;
                    color: $uni-text-color-grey-3;
                }
            }
            .addressName {
                margin-top: 10rpx;
                font-size: 30rpx;
                color: $uni-text-color;
            }
        }
    
        .btnBox {
            padding: 0 30rpx 30rpx;
            display: flex;
            align-items: center;
            justify-content: space-between;
            .defaultBox {
                display: flex;
                align-items: center;
                .checkIcon {
                    width: 36rpx;
                    height: 36rpx;
                    margin-right: 15rpx;
                }
                .mr {
                    font-size: 28rpx;
                    color: $uni-text-color-grey-6;
                }
                .ismr {
                    color: $uni-color-primary;
                }
            }
            .editDelete {
                display: flex;
                font-size: 28rpx;
                color: $uni-text-color;
                .edit {
                    display: flex;
                    margin-right: 60rpx;
                }
                .delete {
                    display: flex;
                }
            }
        }
    }
</style>